<section class="modal active modal-open" id="delete-series-status-modal" style="display: block;" ng-controller="BulkDeleteCtrl">
  <header>
    <a ng-click="close()" class="fa fa-times close-modal"></a>
    <h2 translate="BULK_ACTIONS.DELETE.SERIES.CAPTION"><!-- Delete Series --></h2>
  </header>

  <div class="modal-content">

    <div class="modal-body">

      <div class="modal-alert danger obj">
        <p translate="BULK_ACTIONS.DELETE_SERIES_WARNING_LINE1">
        <!-- You have chosen to delete a series. Once deleted all metadata will be deleted
          and can not be retrieved. -->
        </p>
        <p translate="BULK_ACTIONS.DELETE_SERIES_WARNING_LINE2">
        <!-- By pressing delete you understand that this metadata in unrecoverable. -->
        </p>
      </div>

      <div ng-show="!allowed()" class="alert sticky warning">
        <p translate="BULK_ACTIONS.DELETE.SERIES.CANNOT_DELETE">
        <!-- The highlighted series cannot be deleted as they still contain events -->
        </p>
      </div>

      <div class="full-col">
        <div class="obj">
          <header translate="EVENTS.SERIES.TABLE.CAPTION"><!-- Series --></header>
          <div class="obj-container">
            <table class="main-tbl">
              <thead>
                <tr>
                  <th class="small">
                    <input type="checkbox" ng-model="allSelected" ng-change="allSelectedChanged()" class="select-all-cbox">
                  </th>
                  <th translate="EVENTS.SERIES.TABLE.TITLE"><!-- Series --></th>
                  <th translate="EVENTS.SERIES.TABLE.ORGANIZERS"><!-- Organizer(s) --></th>
                  <th translate="EVENTS.SERIES.TABLE.HAS_EVENTS"><!-- Has events --></th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="row in rows" ng-class="{error: !deleteSeriesWithEventsAllowed && row.selected && row.hasEvents}">
                  <td>
                    <input type="checkbox" ng-model="row.selected" ng-change="rowSelectionChanged($index)" class="child-cbox">
                  </td>
                  <td>{{ row.title }}</td>
                  <td>
                    <span class="metadata-entry" ng-repeat="creator in row.creators">{{ creator }}</span>
                  </td>
                  <td ng-class="row.hasEvents == true ? 'fa fa-check' : ''"></td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>

  </div>

  <footer>
    <a translate="BULK_ACTIONS.DELETE.SERIES.BUTTON" class="danger" ng-class="{disabled: !valid() || !allowed()}" ng-click="submit()">
      <!-- Delete -->
    </a>
    <a translate="CANCEL" ng-click="close()" class="cancel">
      <!-- Cancel -->
    </a>
  </footer>
</section>
